<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<!-- 3.登入页面
	用户名输入框，
	密码输入框，
	提交按钮
	
	任务   3.1 用户名框获取焦点事件，控制台输出：用户在输入名称
	         3.2  用户名框失去焦点事件，判断是否有输入文字，没有则alert没有输入用户名
	         3.3  密码框获取焦点事件，控制台输出：用户在输入密码
	         3.4  密码框失去焦点事件，判断是否有输入文字，没有则alert没有输入密码
	         3.5 点击提交按钮，判断用户和密码是否为空。用户名为空，提示‘用户名为空’；
	              密码为空，提示‘密码为空’；均为空，则提示‘用户名和密码为空’ -->
	<body>
		用户名:<input type="text" name="" id="username" value="" onfocus="hqjd(); onabort=sqjd()"/>
		密  码:<input type="password" name="" id="pwd" value="" onfocus="mmhqjd(); onabort=mmsqjd()" />
		<button type="submit" onclick="aa()">提交</button>
	</body>
	<script type="text/javascript">
		// function hqjd(){
		// 	console.log('用户在输入名称')
		// }
		// function sqjd(){
		// 	if(document.getElementById('username').value ==''){
		// 		alert('没有输入用户名')
		// 	}
		// }
		// function mmhqjd(){
		// 	console.log('用户在输入密码')
		// }
		// function mmsqjd(){
		// 	if(document.getElementById('pwd').value == ''){
		// 		alert('没有输入密码')
		// 	}
		// }
		function aa(){
			
			if(document.getElementById('pwd').value == '' && document.getElementById('username').value ==''){
				alert('用户名和密码为空')
			}else if(document.getElementById('username').value ==''){
				alert('用户名不能为空')
			}
			else if(document.getElementById('pwd').value == ''){
				alert('密码不能为空')
			}
		}
	</script>
</html>
